<!DOCTYPE html>
<html class="no-js" lang="zxx">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Rossi - Sport eCommerce Bootstrap 4 Template</title>
    <meta name="description" content="">
    <meta name="viewport" content="width=device-width, initial-scale=1">

    <!-- Favicon -->
    <link rel="icon" href="assets/images/favicon.ico">

    <!-- ************************* CSS ************************* -->
    <!-- Bootstrap CSS -->
    <link href="assets/css/bootstrap.min.css" rel="stylesheet">

    <!-- Fontawesome CSS -->
    <link href="assets/css/font-awesome.min.css" rel="stylesheet">

    <!-- IcoFont CSS -->
    <link href="assets/css/icon-font.min.css" rel="stylesheet">

    <!-- Plugins CSS -->
    <link href="assets/css/plugins.css" rel="stylesheet">

    <!-- Main CSS -->
    <link href="assets/css/main.min.css" rel="stylesheet">

    <!-- Modernizer JS -->
    <script src="assets/js/vendor/modernizr-2.8.3.min.js"></script>

</head>

<body class="full-width">

    <!--=============================
	=            Header             =
	==============================-->

    <header>
        <!-- header top nav -->
        <div class="header-top-nav">
            <div class="container">
                <div class="row">
                    <div class="col-lg-3 offset-lg-3 col-md-6 col-sm-12">
                        <!-- language and currency changer -->
                        <div class="language-currency-changer d-flex justify-content-center justify-content-md-start justify-content-lg-center">
                            <div class="language-changer">
                                <img src="assets/images/flags/1.jpg" alt="">
                                <a href="#" id="changeLanguage"><span id="languageName">English <i class="fa fa-caret-down"></i></span></a>
                                <div class="language-currency-list hidden" id="languageList">
                                    <ul>
                                        <li><a href="#"><img src="assets/images/flags/1.jpg" alt=""> English</a></li>
                                        <li><a href="#"><img src="assets/images/flags/2.jpg" alt=""> Français</a></li>
                                    </ul>
                                </div>
                            </div>
                            <div class="currency-changer">
                                <a href="#" id="changeCurrency"><span id="currencyName">USD <i class="fa fa-caret-down"></i></span></a>
                                <div class="language-currency-list hidden" id="currencyList">
                                    <ul>
                                        <li><a href="#">USD</a></li>
                                        <li><a href="#">EURO</a></li>
                                    </ul>
                                </div>
                            </div>
                        </div>
                        <!-- end of language and currency changer -->
                    </div>


                    <div class="col-md-6 col-sm-12">
                        <!-- user information menu -->
                        <div class="user-information-menu">
                            <ul>
                                <li><a href="wishlist.html">我的收藏</a> <span class="separator">|</span></li>
                                <li><a href="checkout.html">查看</a> <span class="separator">|</span></li>
                                <li><a href="cart.html">购物车 (<span id="cart-status">暂无</span>)</a> <span class="separator">|</span></li>
                                <li><a href="login-register.html">登录</a></li>
                            </ul>
                        </div>
                        <!-- end of user information menu -->
                    </div>

                </div>
            </div>
        </div>
        <!-- end of header top nav -->

        <!-- header content -->
        <div class="header-content">
            <div class="container">
                <div class="row">
                    <div class="col-lg-3 col-md-4 offset-lg-0 text-md-left text-sm-center">
                        <!-- logo -->
                        <div class="logo">
                            <a href="index.html"><img src="assets/images/logo.png" class="img-fluid" alt="logo"></a>
                        </div>
                        <!-- end of logo -->
                    </div>
                    <div class="col-lg-6 col-md-8">
                        <!-- header search bar -->
                        <div class="header-search-bar">
                            <div class="input-group">
                                <select name="categoryName" id="categoryName">
                                    <option value="">分类</option>
                                    <option value="01">足球</option>
                                    <option value="02">--- 连衣裙</option>
                                    <option value="03">--- 运动衫</option>
                                    <option value="04">--- 靴子</option>
                                    <option value="05">板球</option>
                                </select>
                                <div class="input-group-append">
                                    <input type="search" name="search">
                                    <button type="submit"><i class="fa fa-search"></i></button>
                                </div>
                            </div>
                        </div>
                        <!-- end of header search bar -->
                    </div>
                    <div class="col-lg-3 col-md-4">
                        <!-- shopping cart -->
                        <div class="shopping-cart float-lg-right d-flex justify-content-start" id="shopping-cart">
                            <div class="cart-icon">
                                <a href="cart.html"><img src="assets/images/icon-topcart.png" class="img-fluid" alt=""></a>
                            </div>
                            <div class="cart-content">
                                <h2><a href="cart.html">购物车 <span><span id="cartStatus">(暂无)</span></span></a></h2>
                            </div>

                            <div class="cart-floating-box" id="cart-floating-box">
                                <div class="cart-items">
                                    <div class="cart-float-single-item d-flex">
                                        <span class="remove-item"><a href="#"><i class="fa fa-trash"></i></a></span>
                                        <div class="cart-float-single-item-image">
                                            <img src="assets/images/products/faded-short-sleeve-tshirts.jpg" class="img-fluid"
                                                alt="">
                                        </div>
                                        <div class="cart-float-single-item-desc">
                                            <p class="product-title"><span class="count">1x</span> <a href="single-product-variable.html">印花裙</a></p>
                                            <p class="size"> <a href="shop-left-sidebar.html">黄色, S号</a></p>
                                            <p class="price">$20.50</p>
                                        </div>
                                    </div>
                                    <div class="cart-float-single-item d-flex">
                                        <span class="remove-item"><a href="#"><i class="fa fa-trash"></i></a></span>
                                        <div class="cart-float-single-item-image">
                                            <img src="assets/images/products/faded-short-sleeve-tshirts.jpg" class="img-fluid"
                                                alt="">
                                        </div>
                                        <div class="cart-float-single-item-desc">
                                            <p class="product-title"><span class="count">1x</span> <a href="single-product-variable.html">印花裙</a></p>
                                            <p class="size"> <a href="shop-left-sidebar.html">黄色, S号</a></p>
                                            <p class="price">$20.50</p>
                                        </div>
                                    </div>
                                </div>
                                <div class="cart-calculation d-flex">
                                    <div class="calculation-details">
                                        <p class="shipping">运费 <span>$2</span></p>
                                        <p class="total">总共 <span>$22</span></p>
                                    </div>
                                    <div class="checkout-button">
                                        <a href="checkout.html">结算</a>
                                    </div>
                                </div>
                            </div>
                            <!-- end of shopping cart -->
                        </div>
                    </div>
                </div>
            </div>
        </div>
        <!-- end of header content -->
        <!-- header navigation menu -->
        <nav class="header-navigation black-bg">
            <div class="container px-0">
                <div class="navigation-container mb-0">
                    <div class="row">
                        <div class="col-lg-3 d-none d-lg-block">
                            <!-- ======  Header menu left text  ====== -->
                            <p class="call-us-text">联系我们 24/7: (+66) 123-456-789</p>
                        </div>
                        <div class="col-lg-9 col-md-12">

                            <!-- Header navigation right side-->

                            <!-- main menu start -->
                            <div class="main-menu">
                                <nav>
                                    <ul>
                                        <li class="active menu-item-has-children"><a href="#">主页</a>

                                            <!-- ======  Submenu block  ======= -->

                                            <ul class="sub-menu">
                                                <li class="active"><a href="index.html">主页一</a></li>
                                                <li><a href="index-2.html">主页二</a></li>
                                                <li><a href="index-3.html">主页三</a></li>
                                            </ul>

                                            <!-- ====  End of Submenu block  ==== -->

                                        </li>
                                        <li class="menu-item-has-children"><a href="#">店铺</a>

                                            <!-- ======  Submenu block  ======= -->

                                            <ul class="sub-menu">
                                                <li class="menu-item-has-children"><a href="#">店铺分类</a>
                                                    <ul class="sub-menu">
                                                        <li class="active"><a href="shop-left-sidebar.html">商铺 左侧边栏</a></li>
                                                        <li><a href="shop-left-sidebar-wide.html">商铺 左宽侧边栏</a></li>
                                                        <li><a href="shop-right-sidebar.html">商铺 右侧边栏</a></li>
                                                        <li><a href="shop-right-sidebar-wide.html">商铺 右侧边栏</a></li>
                                                        <li><a href="shop-no-sidebar-3.html">商铺 无侧边栏 3列</a></li>
                                                        <li><a href="shop-no-sidebar-3-wide.html">商铺 无侧边栏 3列宽</a></li>
                                                        <li><a href="shop-no-sidebar-4.html">商铺 无侧边栏 4列</a></li>
                                                        <li><a href="shop-no-sidebar-4-wide.html">商铺 无侧边栏 4列宽</a></li>
                                                        <li><a href="shop-no-sidebar-5.html">商铺 无侧边栏 5列</a></li>
                                                        <li><a href="shop-no-sidebar-5-wide.html">商铺 无侧边栏 5列宽</a></li>
                                                    </ul>
                                                </li>
                                                <li class="menu-item-has-children"><a href="#">店铺列表</a>
                                                    <ul class="sub-menu">
                                                        <li><a href="shop-list.html">商店 列表</a></li>
                                                        <li><a href="shop-list-wide.html">商店列表宽</a></li>
                                                        <li><a href="shop-left-sidebar-list.html">商店列表 左侧边栏</a></li>
                                                        <li><a href="shop-left-sidebar-list-wide.html">商店列表 左侧边栏宽</a></li>
                                                        <li><a href="shop-right-sidebar-list.html">商店列表 右侧边栏</a></li>
                                                        <li><a href="shop-right-sidebar-list-wide.html">商店列表 右侧边栏宽</a></li>
                                                    </ul>
                                                </li>
                                                <li class="menu-item-has-children"><a href="#">商品展示</a>
																	<ul class="sub-menu">
																		<li><a href="single-product.html">商品</a></li>
																		<li><a href="single-product-wide.html">商品 宽</a></li>
																		<li><a href="single-product-external.html">商品 外部</a></li>
																		<li><a href="single-product-external-wide.html">商品 外部 宽</a></li>
																		<li><a href="single-product-variable.html">商品 可变</a></li>
																		<li><a href="single-product-variable-wide.html">商品 可变 宽</a></li>
																		<li><a href="single-product-group.html">商品 组</a></li>
																		<li><a href="single-product-group-wide.html">商品 组 宽</a></li>
																	</ul>
																</li>
                                            </ul>
                                            <!-- ====  End of Submenu block  ==== -->

                                        </li>
                                        <li class="menu-item-has-children"><a href="#">博客</a>
                                            <!-- ======  Mega menu block  ======= -->
                                            <ul class="mega-menu three-column">
                                                <li><a href="#" class="d-none">博客</a>
                                                    <ul>
                                                        <li><a href="blog-1-column-left-sidebar.html">博客 1 列 左侧边栏</a></li>
                                                        <li><a href="blog-1-column-right-sidebar.html">博客 1 列 右侧边栏</a></li>
                                                        <li><a href="blog-2-column-left-sidebar.html">博客 2 列 左侧边栏</a></li>
                                                        <li><a href="blog-2-column-right-sidebar.html">博客 2 列 右侧边栏</a></li>
                                                        <li><a href="blog-3-column.html">博客 3 列</a></li>
                                                    </ul>
                                                </li>
                                                <li><a href="#" class="d-none">博客 宽</a>
                                                    <ul>
                                                        <li><a href="blog-1-column-left-sidebar-wide.html">博客 1 列 左侧边栏 宽</a></li>
                                                        <li><a href="blog-1-column-right-sidebar-wide.html">博客 1 列 右侧边栏 宽</a></li>
                                                        <li><a href="blog-2-column-left-sidebar-wide.html">博客 2 列 左侧边栏 宽</a></li>
                                                        <li><a href="blog-2-column-right-sidebar-wide.html">博客 2 列 右侧边栏 宽</a></li>
                                                        <li><a href="blog-3-column-wide.html">博客 3 列 宽</a></li>
                                                    </ul>
                                                </li>
                                                <li><a href="#" class="d-none">单博客</a>
																	<ul>
																		<li><a href="single-blog-left-sidebar.html">单博客 左侧边栏</a></li>
																		<li><a href="single-blog-left-sidebar-wide.html">单博客 左侧边栏 宽</a></li>
																		<li><a href="single-blog-right-sidebar.html">单博客 右侧边栏</a></li>
																		<li><a href="single-blog-right-sidebar-wide.html">单博客 右侧边栏 宽</a></li>
																	</ul>
																</li>
                                            </ul>
                                            <!-- ====  End of Mega menu block  ==== -->
                                        </li>

                                        <li class="menu-item-has-children"><a href="#">页面</a>
                                            <!-- ======  Submenu block  ======= -->

                                            <ul class="sub-menu">
                                                <li><a href="cart.html">购物车</a></li>
																<li><a href="cart-wide.html">购物车 宽</a></li>
																<li><a href="checkout.html">结算</a></li>
																<li><a href="checkout-wide.html">结算 宽</a></li>
																<li><a href="compare.html">对比</a></li>
																<li><a href="compare-wide.html">结算 宽</a></li>
																<li><a href="store.html">店铺</a></li>
																<li><a href="store-wide.html">店铺 宽</a></li>
																<li><a href="wishlist.html">愿望清单</a></li>
																<li><a href="wishlist-wide.html">愿望清单 宽</a></li>
																<li><a href="my-account.html">我的账户</a></li>
																<li><a href="my-account-wide.html">我的账户 宽</a></li>
																<li><a href="login-register.html">登录 注册</a></li>
																<li><a href="login-register-wide.html">登录 注册 宽</a></li>
                                            </ul>

                                            <!-- ====  End of Submenu block  ==== -->
                                        </li>
                                        <li><a href="about.html">关于</a></li>
														<li><a href="contact.html">联系</a></li>
                                    </ul>
                                </nav>

                                <!-- Mobile Menu -->
                                <div class="mobile-menu order-12 d-block col d-lg-none"></div>

                            </div>

                            <!-- end of Header navigation right side-->
                        </div>
                    </div>
                </div>
            </div>
        </nav>
        <!-- end of header navigation menu -->

    </header>
    <!--====  End of Header   ====-->

    <!--===========================================
	=            homepage content section            =
    ============================================-->


    <!-- Slider area -->
    <section class="hero-slider-container">
        <!-- Hero Slider Start -->
        <div class="hero-slider hero-slider-one mb-20">
            <!-- Hero Item Start -->
            <div class="hero-item hero-bg-3">
                <div class="row align-items-center justify-content-between">

                    <!-- Hero Content -->
                    <div class="hero-content col-md-6 offset-md-6 col-sm-12 offset-sm-0">
                        <h1>冬季</h1>
                        <h2><span>冬日运动</span></h2>
                        <p>冬季运动要注意保暖，不能像夏天那样肆无忌惮，很容易造成膝盖损伤，我们这款产品经历了多年研发，最适宜在冬季运动时保护身体...</p>
                        <a href="shop-left-sidebar.html">立即购买</a>
                    </div>


                </div>
            </div><!-- Hero Item End -->

            <!-- Hero Item Start -->
            <div class="hero-item hero-bg-4">
                <div class="row align-items-center justify-content-between">

                    <!-- Hero Content -->
                    <div class="hero-content col-md-6 offset-md-6 col-sm-12 offset-sm-0">

                        <h1>冬季</h1>
                        <h2><span>冬日运动</span></h2>
                        <p>冬季运动要注意保暖，不能像夏天那样肆无忌惮，很容易造成膝盖损伤，我们这款产品经历了多年研发，最适宜在冬季运动时保护身体...</p>
                        <a href="shop-left-sidebar.html">立即购买</a>

                    </div>
                </div>
            </div><!-- Hero Item End -->
        </div><!-- Hero Slider End -->
    </section>
    <!-- end of slider  area -->


    <!-- featured service section -->
    <!-- featured service -->
    <section class="featured-service-container mb-20">
        <div class="container">
            <div class="row">
                <div class="col-lg-4 col-md-6">
                    <!-- single-feature -->
                    <div class="single-featured-service featured-service-bg-1">
                        <div class="single-featured-service-content">
                            <h3>冬季</h3>
																<p>冬季是漫长而美好的，有很多有趣的事情 </p>
																<a href="shop-left-sidebar.html">查看并收藏</a>
                        </div>
                    </div>
                    <!-- end of single feature -->
                </div>
                <div class="col-lg-4 col-md-6">
                    <!-- single-feature -->
                    <div class="single-featured-service featured-service-bg-2">
                        <div class="single-featured-service-content">
                            <h3>冬季</h3>
																<p>冬季是漫长而美好的，有很多有趣的事情 </p>
																<a href="shop-left-sidebar.html">查看并收藏</a>
                        </div>
                    </div>
                    <!-- end of single feature -->
                </div>
                <div class="col-lg-4 col-md-6">
                    <!-- single-feature -->
                    <div class="single-featured-service featured-service-bg-3">
                        <div class="single-featured-service-content">
                            <h3>冬季</h3>
																<p>冬季是漫长而美好的，有很多有趣的事情 </p>
																<a href="shop-left-sidebar.html">查看并收藏</a>
                        </div>
                    </div>
                    <!-- end of single feature -->
                </div>
            </div>
        </div>
    </section>
    <!-- end of featured service -->
    <!-- End of featured service section -->
    <div class="homepage-content">
        <div class="container">
            <div class="row">
                <div class="col-lg-3 col-md-4">
                    <!-- Header category list -->
                    <div class="hero-side-category">

                            <!-- Category Toggle Wrap -->
                            <div class="category-toggle-wrap">
                                <!-- Category Toggle -->
                                <button class="category-toggle">分类 <i class="ti-menu"></i></button>
                            </div>

                            <!-- Category Menu -->
                            <nav class="category-menu">
                                <ul>
                                    <li><a href="shop-left-sidebar-wide.html">足球</a></li>
                                    <li class="menu-item-has-children"><a href="shop-left-sidebar-wide.html">网球</a>

                                        <!-- Mega Category Menu Start -->
                                        <ul class="category-mega-menu">
                                            <li class="menu-item-has-children">
                                                <a class="megamenu-head" href="shop-left-sidebar-wide.html">连衣裙</a>
                                                <ul>
                                                    <li><a href="shop-left-sidebar.html">燕尾服</a></li>
																		<li><a href="shop-left-sidebar.html">白天</a></li>
																		<li><a href="shop-left-sidebar.html">晚上</a></li>
																		<li><a href="shop-left-sidebar.html">运动</a></li>
                                                </ul>
                                            </li>
                                            <li class="menu-item-has-children">
                                                <a class="megamenu-head" href="shop-left-sidebar-wide.html">鞋</a>
                                                <ul>
                                                    <li><a href="shop-left-sidebar.html">燕尾服</a></li>
																		<li><a href="shop-left-sidebar.html">白天</a></li>
																		<li><a href="shop-left-sidebar.html">晚上</a></li>
																		<li><a href="shop-left-sidebar.html">运动</a></li>
                                                </ul>
                                            </li>
                                            <li class="menu-item-has-children">
                                                <a class="megamenu-head" href="shop-left-sidebar-wide.html">手提包</a>
                                                <ul>
                                                    <li><a href="shop-left-sidebar.html">燕尾服</a></li>
																		<li><a href="shop-left-sidebar.html">白天</a></li>
																		<li><a href="shop-left-sidebar.html">晚上</a></li>
																		<li><a href="shop-left-sidebar.html">运动</a></li>
                                                </ul>
                                            </li>
                                        </ul><!-- Mega Category Menu End -->

                                    </li>
                                    <li class="menu-item-has-children"><a href="shop-left-sidebar-wide.html">篮球</a>

                                        <!-- Mega Category Menu Start -->
                                        <ul class="category-mega-menu">
                                            <li class="menu-item-has-children">
                                                <a class="megamenu-head" href="shop-left-sidebar-wide.html">连衣裙</a>
                                                <ul>
                                                    <li><a href="shop-left-sidebar.html">燕尾服</a></li>
																		<li><a href="shop-left-sidebar.html">白天</a></li>
																		<li><a href="shop-left-sidebar.html">晚上</a></li>
																		<li><a href="shop-left-sidebar.html">运动</a></li>
                                                </ul>
                                            </li>
                                            <li class="menu-item-has-children">
                                                <a class="megamenu-head" href="shop-left-sidebar-wide.html">鞋</a>
                                                <ul>
                                                    <li><a href="shop-left-sidebar.html">燕尾服</a></li>
																		<li><a href="shop-left-sidebar.html">白天</a></li>
																		<li><a href="shop-left-sidebar.html">晚上</a></li>
																		<li><a href="shop-left-sidebar.html">运动</a></li>
                                                </ul>
                                            </li>
                                            <li class="menu-item-has-children">
                                                <a class="megamenu-head" href="shop-left-sidebar-wide.html">手提包</a>
                                                <ul>
                                                    <li><a href="shop-left-sidebar.html">燕尾服</a></li>
																		<li><a href="shop-left-sidebar.html">白天</a></li>
																		<li><a href="shop-left-sidebar.html">晚上</a></li>
																		<li><a href="shop-left-sidebar.html">运动</a></li>
                                                </ul>
                                            </li>
                                        </ul><!-- Mega Category Menu End -->

                                    </li>
                                    <li><a href="shop-left-sidebar.html">板球</a></li>
														<li><a href="shop-left-sidebar.html">棒球</a></li>
														<li><a href="shop-left-sidebar.html">滑板</a></li>
														<li><a href="shop-left-sidebar.html">配饰</a></li>
														<li><a href="shop-left-sidebar.html">鞋</a></li>
														<li><a href="shop-left-sidebar.html">羽毛球</a></li>
                                </ul>
                            </nav>
                    </div>
                    <!-- end of Header category list -->
                </div>
                <div class="col-lg-9 col-lg-">
                        <!-- homepage horizontal tab slider -->
                        <div class="horizontal-tab-section">
                            <nav>
                                <div class="nav nav-tabs" id="nav-tab" role="tablist">
                                    <a class="nav-item nav-link active" id="nav-home-tab" data-toggle="tab" href="#new-arrival"
                                        role="tab" aria-selected="true">新抵达</a>
                                    <a class="nav-item nav-link" id="nav-profile-tab" data-toggle="tab" href="#on-sale"
                                        role="tab" aria-selected="false">出售</a>
                                    <a class="nav-item nav-link" id="nav-contact-tab" data-toggle="tab" href="#featured-product"
                                        role="tab" aria-selected="false">特色产品</a>
                                </div>
                            </nav>
                            <div class="tab-content" id="nav-tabContent">
                                <div class="tab-pane fade show active" id="new-arrival" role="tabpanel" aria-labelledby="nav-home-tab">
                                    <!-- horizontal product slider -->
                                    <div class="horizontal-product-slider section-padding pb-0">

                                        <div class="row">
                                            <div class="col-lg-12">
                                                <!-- horizontal product slider container -->
                                                <div class="horizontal-product-list">
                                                    <!-- single product -->
                                                    <div class="single-product">
                                                        <div class="single-product-content">
                                                            <div class="product-image">
                                                                <a href="single-product-variable-wide.html">
                                                                    <img src="assets/images/products/3.jpg" class="img-fluid"
                                                                        alt="">
                                                                    <img src="assets/images/products/4.jpg" class="img-fluid"
                                                                        alt="">
                                                                </a>
                                                                <div class="image-btn">
                                                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                            class="fa fa-search"></i></a>
                                                                    <a href="#"><i class="fa fa-heart-o"></i></a>
                                                                </div>
                                                            </div>
                                                            <h5 class="product-name"><a href="single-product-variable-wide.html">印花裙</a></h5>
                                                            <div class="price-box">
                                                                <h4>$ 12.00</h4>
                                                            </div>

                                                            <a href="#" class="add-to-cart-btn" data-toggle="modal"
                                                                data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                                                添加到购物车</a>
                                                        </div>
                                                    </div>
                                                    <!-- end of single product -->

                                                    <!-- single product -->
                                                    <div class="single-product">
                                                        <div class="single-product-content">
                                                            <div class="product-image">
                                                                <a href="single-product-variable-wide.html">
                                                                    <img src="assets/images/products/1.jpg" class="img-fluid"
                                                                        alt="">
                                                                    <img src="assets/images/products/2.jpg" class="img-fluid"
                                                                        alt="">
                                                                </a>
                                                                <div class="image-btn">
                                                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                            class="fa fa-search"></i></a>
                                                                    <a href="#"><i class="fa fa-heart-o"></i></a>
                                                                </div>
                                                            </div>
                                                            <h5 class="product-name"><a href="single-product-variable-wide.html">渐变色短袖</a></h5>
                                                            <div class="price-box">
                                                                <h4>$ 12.00</h4>
                                                            </div>

                                                            <a href="#" class="add-to-cart-btn" data-toggle="modal"
                                                                data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                                                添加到购物车</a>
                                                        </div>
                                                    </div>
                                                    <!-- end of single product -->

                                                    <!-- single product -->
                                                    <div class="single-product">
                                                        <div class="single-product-content">
                                                            <div class="product-image">
                                                                <a href="single-product-variable-wide.html">
                                                                    <img src="assets/images/products/5.jpg" class="img-fluid"
                                                                        alt="">
                                                                    <img src="assets/images/products/6.jpg" class="img-fluid"
                                                                        alt="">
                                                                </a>
                                                                <div class="image-btn">
                                                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                            class="fa fa-search"></i></a>
                                                                    <a href="#"><i class="fa fa-heart-o"></i></a>
                                                                </div>
                                                            </div>
                                                            <h5 class="product-name"><a href="single-product-variable-wide.html">印花裙</a></h5>
                                                            <div class="price-box">
                                                                <h4>$ 12.00</h4>
                                                            </div>

                                                            <a href="#" class="add-to-cart-btn" data-toggle="modal"
                                                                data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                                                添加到购物车</a>
                                                        </div>
                                                    </div>
                                                    <!-- end of single product -->
                                                    <!-- single product -->
                                                    <div class="single-product">
                                                        <div class="single-product-content">
                                                            <div class="product-image">
                                                                <a href="single-product-variable-wide.html">
                                                                    <img src="assets/images/products/7.jpg" class="img-fluid"
                                                                        alt="">
                                                                    <img src="assets/images/products/8.jpg" class="img-fluid"
                                                                        alt="">
                                                                </a>
                                                                <div class="image-btn">
                                                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                            class="fa fa-search"></i></a>
                                                                    <a href="#"><i class="fa fa-heart-o"></i></a>
                                                                </div>
                                                            </div>
                                                            <h5 class="product-name"><a href="single-product-variable-wide.html">渐变色短袖</a></h5>
                                                            <div class="price-box">
                                                                <h4>$ 12.00</h4>
                                                            </div>

                                                            <a href="#" class="add-to-cart-btn" data-toggle="modal"
                                                                data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                                                添加到购物车</a>
                                                        </div>
                                                    </div>
                                                    <!-- end of single product -->
                                                    <!-- single product -->
                                                    <div class="single-product">
                                                        <div class="single-product-content">
                                                            <div class="product-image">
                                                                <a href="single-product-variable-wide.html">
                                                                    <img src="assets/images/products/9.jpg" class="img-fluid"
                                                                        alt="">
                                                                    <img src="assets/images/products/10.jpg" class="img-fluid"
                                                                        alt="">
                                                                </a>
                                                                <div class="image-btn">
                                                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                            class="fa fa-search"></i></a>
                                                                    <a href="#"><i class="fa fa-heart-o"></i></a>
                                                                </div>
                                                            </div>
                                                            <h5 class="product-name"><a href="single-product-variable-wide.html">印花裙</a></h5>
                                                            <div class="price-box">
                                                                <h4>$ 12.00</h4>
                                                            </div>

                                                            <a href="#" class="add-to-cart-btn" data-toggle="modal"
                                                                data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                                                添加到购物车</a>
                                                        </div>
                                                    </div>
                                                    <!-- end of single product -->


                                                </div>
                                                <!-- end of horizontal product slider container -->
                                            </div>
                                        </div>
                                    </div>
                                    <!-- end of horizontal product slider -->
                                </div>
                                <div class="tab-pane fade" id="on-sale" role="tabpanel" aria-labelledby="nav-profile-tab">
                                    <!-- horizontal product slider -->
                                    <div class="horizontal-product-slider section-padding pb-0">

                                        <div class="row">
                                            <div class="col-lg-12">
                                                <!-- horizontal product slider container -->
                                                <div class="horizontal-product-list">
                                                    <!-- single product -->
                                                    <div class="single-product">
                                                        <div class="single-product-content">
                                                            <div class="product-image">
                                                                <a href="single-product-variable-wide.html">
                                                                    <img src="assets/images/products/1.jpg" class="img-fluid"
                                                                        alt="">
                                                                    <img src="assets/images/products/2.jpg" class="img-fluid"
                                                                        alt="">
                                                                </a>
                                                                <div class="image-btn">
                                                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                            class="fa fa-search"></i></a>
                                                                    <a href="#"><i class="fa fa-heart-o"></i></a>
                                                                </div>
                                                            </div>
                                                            <h5 class="product-name"><a href="single-product-variable-wide.html">渐变色短袖</a></h5>
                                                            <div class="price-box">
                                                                <h4>$ 12.00</h4>
                                                            </div>

                                                            <a href="#" class="add-to-cart-btn" data-toggle="modal"
                                                                data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                                                添加到购物车</a>
                                                        </div>
                                                    </div>
                                                    <!-- end of single product -->
                                                    <!-- single product -->
                                                    <div class="single-product">
                                                        <div class="single-product-content">
                                                            <div class="product-image">
                                                                <a href="single-product-variable-wide.html">
                                                                    <img src="assets/images/products/3.jpg" class="img-fluid"
                                                                        alt="">
                                                                    <img src="assets/images/products/4.jpg" class="img-fluid"
                                                                        alt="">
                                                                </a>
                                                                <div class="image-btn">
                                                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                            class="fa fa-search"></i></a>
                                                                    <a href="#"><i class="fa fa-heart-o"></i></a>
                                                                </div>
                                                            </div>
                                                            <h5 class="product-name"><a href="single-product-variable-wide.html">印花裙</a></h5>
                                                            <div class="price-box">
                                                                <h4>$ 12.00</h4>
                                                            </div>

                                                            <a href="#" class="add-to-cart-btn" data-toggle="modal"
                                                                data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                                                添加到购物车</a>
                                                        </div>
                                                    </div>
                                                    <!-- end of single product -->
                                                    <!-- single product -->
                                                    <div class="single-product">
                                                        <div class="single-product-content">
                                                            <div class="product-image">
                                                                <a href="single-product-variable-wide.html">
                                                                    <img src="assets/images/products/5.jpg" class="img-fluid"
                                                                        alt="">
                                                                    <img src="assets/images/products/6.jpg" class="img-fluid"
                                                                        alt="">
                                                                </a>
                                                                <div class="image-btn">
                                                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                            class="fa fa-search"></i></a>
                                                                    <a href="#"><i class="fa fa-heart-o"></i></a>
                                                                </div>
                                                            </div>
                                                            <h5 class="product-name"><a href="single-product-variable-wide.html">印花裙</a></h5>
                                                            <div class="price-box">
                                                                <h4>$ 12.00</h4>
                                                            </div>

                                                            <a href="#" class="add-to-cart-btn" data-toggle="modal"
                                                                data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                                                添加到购物车</a>
                                                        </div>
                                                    </div>
                                                    <!-- end of single product -->
                                                    <!-- single product -->
                                                    <div class="single-product">
                                                        <div class="single-product-content">
                                                            <div class="product-image">
                                                                <a href="single-product-variable-wide.html">
                                                                    <img src="assets/images/products/7.jpg" class="img-fluid"
                                                                        alt="">
                                                                    <img src="assets/images/products/8.jpg" class="img-fluid"
                                                                        alt="">
                                                                </a>
                                                                <div class="image-btn">
                                                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                            class="fa fa-search"></i></a>
                                                                    <a href="#"><i class="fa fa-heart-o"></i></a>
                                                                </div>
                                                            </div>
                                                            <h5 class="product-name"><a href="single-product-variable-wide.html">渐变色短袖</a></h5>
                                                            <div class="price-box">
                                                                <h4>$ 12.00</h4>
                                                            </div>

                                                            <a href="#" class="add-to-cart-btn" data-toggle="modal"
                                                                data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                                                添加到购物车</a>
                                                        </div>
                                                    </div>
                                                    <!-- end of single product -->
                                                    <!-- single product -->
                                                    <div class="single-product">
                                                        <div class="single-product-content">
                                                            <div class="product-image">
                                                                <a href="single-product-variable-wide.html">
                                                                    <img src="assets/images/products/9.jpg" class="img-fluid"
                                                                        alt="">
                                                                    <img src="assets/images/products/10.jpg" class="img-fluid"
                                                                        alt="">
                                                                </a>
                                                                <div class="image-btn">
                                                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                            class="fa fa-search"></i></a>
                                                                    <a href="#"><i class="fa fa-heart-o"></i></a>
                                                                </div>
                                                            </div>
                                                            <h5 class="product-name"><a href="single-product-variable-wide.html">印花裙</a></h5>
                                                            <div class="price-box">
                                                                <h4>$ 12.00</h4>
                                                            </div>

                                                            <a href="#" class="add-to-cart-btn" data-toggle="modal"
                                                                data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                                                添加到购物车</a>
                                                        </div>
                                                    </div>
                                                    <!-- end of single product -->


                                                </div>
                                                <!-- end of horizontal product slider container -->
                                            </div>
                                        </div>
                                    </div>
                                    <!-- end of horizontal product slider -->
                                </div>
                                <div class="tab-pane fade" id="featured-product" role="tabpanel" aria-labelledby="nav-contact-tab">
                                    <!-- horizontal product slider -->
                                    <div class="horizontal-product-slider section-padding pb-0">

                                        <div class="row">
                                            <div class="col-lg-12">
                                                <!-- horizontal product slider container -->
                                                <div class="horizontal-product-list">
                                                    <!-- single product -->
                                                    <div class="single-product">
                                                        <div class="single-product-content">
                                                            <div class="product-image">
                                                                <a href="single-product-variable-wide.html">
                                                                    <img src="assets/images/products/7.jpg" class="img-fluid"
                                                                        alt="">
                                                                    <img src="assets/images/products/8.jpg" class="img-fluid"
                                                                        alt="">
                                                                </a>
                                                                <div class="image-btn">
                                                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                            class="fa fa-search"></i></a>
                                                                    <a href="#"><i class="fa fa-heart-o"></i></a>
                                                                </div>
                                                            </div>
                                                            <h5 class="product-name"><a href="single-product-variable-wide.html">渐变色短袖</a></h5>
                                                            <div class="price-box">
                                                                <h4>$ 12.00</h4>
                                                            </div>

                                                            <a href="#" class="add-to-cart-btn" data-toggle="modal"
                                                                data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                                                添加到购物车</a>
                                                        </div>
                                                    </div>
                                                    <!-- end of single product -->
                                                    <!-- single product -->
                                                    <div class="single-product">
                                                        <div class="single-product-content">
                                                            <div class="product-image">
                                                                <a href="single-product-variable-wide.html">
                                                                    <img src="assets/images/products/1.jpg" class="img-fluid"
                                                                        alt="">
                                                                    <img src="assets/images/products/2.jpg" class="img-fluid"
                                                                        alt="">
                                                                </a>
                                                                <div class="image-btn">
                                                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                            class="fa fa-search"></i></a>
                                                                    <a href="#"><i class="fa fa-heart-o"></i></a>
                                                                </div>
                                                            </div>
                                                            <h5 class="product-name"><a href="single-product-variable-wide.html">渐变色短袖</a></h5>
                                                            <div class="price-box">
                                                                <h4>$ 12.00</h4>
                                                            </div>

                                                            <a href="#" class="add-to-cart-btn" data-toggle="modal"
                                                                data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                                                添加到购物车</a>
                                                        </div>
                                                    </div>
                                                    <!-- end of single product -->
                                                    <!-- single product -->
                                                    <div class="single-product">
                                                        <div class="single-product-content">
                                                            <div class="product-image">
                                                                <a href="single-product-variable-wide.html">
                                                                    <img src="assets/images/products/3.jpg" class="img-fluid"
                                                                        alt="">
                                                                    <img src="assets/images/products/4.jpg" class="img-fluid"
                                                                        alt="">
                                                                </a>
                                                                <div class="image-btn">
                                                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                            class="fa fa-search"></i></a>
                                                                    <a href="#"><i class="fa fa-heart-o"></i></a>
                                                                </div>
                                                            </div>
                                                            <h5 class="product-name"><a href="single-product-variable-wide.html">印花裙</a></h5>
                                                            <div class="price-box">
                                                                <h4>$ 12.00</h4>
                                                            </div>

                                                            <a href="#" class="add-to-cart-btn" data-toggle="modal"
                                                                data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                                                添加到购物车</a>
                                                        </div>
                                                    </div>
                                                    <!-- end of single product -->
                                                    <!-- single product -->
                                                    <div class="single-product">
                                                        <div class="single-product-content">
                                                            <div class="product-image">
                                                                <a href="single-product-variable-wide.html">
                                                                    <img src="assets/images/products/5.jpg" class="img-fluid"
                                                                        alt="">
                                                                    <img src="assets/images/products/6.jpg" class="img-fluid"
                                                                        alt="">
                                                                </a>
                                                                <div class="image-btn">
                                                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                            class="fa fa-search"></i></a>
                                                                    <a href="#"><i class="fa fa-heart-o"></i></a>
                                                                </div>
                                                            </div>
                                                            <h5 class="product-name"><a href="single-product-variable-wide.html">印花裙</a></h5>
                                                            <div class="price-box">
                                                                <h4>$ 12.00</h4>
                                                            </div>

                                                            <a href="#" class="add-to-cart-btn" data-toggle="modal"
                                                                data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                                                添加到购物车</a>
                                                        </div>
                                                    </div>
                                                    <!-- end of single product -->

                                                    <!-- single product -->
                                                    <div class="single-product">
                                                        <div class="single-product-content">
                                                            <div class="product-image">
                                                                <a href="single-product-variable-wide.html">
                                                                    <img src="assets/images/products/9.jpg" class="img-fluid"
                                                                        alt="">
                                                                    <img src="assets/images/products/10.jpg" class="img-fluid"
                                                                        alt="">
                                                                </a>
                                                                <div class="image-btn">
                                                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                            class="fa fa-search"></i></a>
                                                                    <a href="#"><i class="fa fa-heart-o"></i></a>
                                                                </div>
                                                            </div>
                                                            <h5 class="product-name"><a href="single-product-variable-wide.html">印花裙</a></h5>
                                                            <div class="price-box">
                                                                <h4>$ 12.00</h4>
                                                            </div>

                                                            <a href="#" class="add-to-cart-btn" data-toggle="modal"
                                                                data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                                                添加到购物车</a>
                                                        </div>
                                                    </div>
                                                    <!-- end of single product -->
                                                </div>
                                                <!-- end of horizontal product slider container -->
                                            </div>
                                        </div>
                                    </div>
                                    <!-- end of horizontal product slider -->
                                </div>
                            </div>
                        </div>
                        <!-- End of homepage horizontal tab slider -->

                        <!-- homepage double banner section -->
                        <div class="homepage-banners mb-50">
                                <div class="row">
                                    <div class="col-lg-6 col-md-12 mb-20 mb-lg-0">
                                        <!-- ======  Homepage single split banner  ======= -->

                                        <div class="single-banner-container">
                                            <a href="shop-left-sidebar.html">
                                                <img src="assets/images/banners/banner3.jpg" class="img-fluid" alt="">
                                            </a>
                                        </div>

                                        <!-- ====  End of Homepage single split banner  ==== -->

                                    </div>
                                    <div class="col-lg-6 col-md-12">
                                        <!-- ======  Homepage single split banner  ======= -->

                                        <div class="single-banner-container">
                                            <a href="shop-left-sidebar.html">
                                                <img src="assets/images/banners/banner4.jpg" class="img-fluid" alt="">
                                            </a>
                                        </div>

                                        <!-- ====  End of Homepage single split banner  ==== -->

                                    </div>

                                </div>
                            </div>
                            <!-- end of homepage double banner section -->
                </div>
            </div>
            <div class="row">
                <div class="col-lg-3 col-md-4">
                    <div class="homepage-sidebar">


                        <!-- vertical auto slider container -->
                        <div class="sidebar">
                            <h2 class="block-title">畅销榜</h2>
                            <div class="vertical-product-slider-container">

                            <div class="single-vertical-slider">

                                <div class="vertical-auto-slider-product-list">
                                    <!-- single vertical product -->
                                    <div class="single-auto-vertical-product d-flex">
                                        <div class="product-image">
                                            <a href="single-product-variable-wide.html"><img src="assets/images/products/1.jpg"
                                                    class="img-fluid" alt=""></a>
                                        </div>
                                        <div class="product-description">
                                            <h5 class="product-name"><a href="single-product-variable-wide.html">渐变色短袖</a></h5>
                                            <div class="price-box">
                                                <h4>$ 12.00</h4>
                                            </div>

                                        </div>
                                    </div>
                                    <!-- end of single vertical product -->
                                    <!-- single vertical product -->
                                    <div class="single-auto-vertical-product d-flex">
                                        <div class="product-image">
                                            <a href="single-product-variable-wide.html"><img src="assets/images/products/2.jpg"
                                                    class="img-fluid" alt=""></a>
                                        </div>
                                        <div class="product-description">
                                            <h5 class="product-name"><a href="single-product-variable-wide.html">渐变色短袖</a></h5>
                                            <div class="price-box">
                                                <h4>$ 12.00</h4>
                                            </div>

                                        </div>
                                    </div>
                                    <!-- end of single vertical product -->
                                    <!-- single vertical product -->
                                    <div class="single-auto-vertical-product d-flex">
                                        <div class="product-image">
                                            <a href="single-product-variable-wide.html"><img src="assets/images/products/3.jpg"
                                                    class="img-fluid" alt=""></a>
                                        </div>
                                        <div class="product-description">
                                            <h5 class="product-name"><a href="single-product-variable-wide.html">渐变色短袖</a></h5>
                                            <div class="price-box">
                                                <h4>$ 12.00</h4>
                                            </div>

                                        </div>
                                    </div>
                                    <!-- end of single vertical product -->
                                    <!-- single vertical product -->
                                    <div class="single-auto-vertical-product d-flex">
                                        <div class="product-image">
                                            <a href="single-product-variable-wide.html"><img src="assets/images/products/4.jpg"
                                                    class="img-fluid" alt=""></a>
                                        </div>
                                        <div class="product-description">
                                            <h5 class="product-name"><a href="single-product-variable-wide.html">渐变色短袖</a></h5>
                                            <div class="price-box">
                                                <h4>$ 12.00</h4>
                                            </div>

                                        </div>
                                    </div>
                                    <!-- end of single vertical product -->
                                    <!-- single vertical product -->
                                    <div class="single-auto-vertical-product d-flex">
                                        <div class="product-image">
                                            <a href="single-product-variable-wide.html"><img src="assets/images/products/5.jpg"
                                                    class="img-fluid" alt=""></a>
                                        </div>
                                        <div class="product-description">
                                            <h5 class="product-name"><a href="single-product-variable-wide.html">渐变色短袖</a></h5>
                                            <div class="price-box">
                                                <h4>$ 12.00</h4>
                                            </div>

                                        </div>
                                    </div>
                                    <!-- end of single vertical product -->
                                    <!-- single vertical product -->
                                    <div class="single-auto-vertical-product d-flex">
                                        <div class="product-image">
                                            <a href="single-product-variable-wide.html"><img src="assets/images/products/6.jpg"
                                                    class="img-fluid" alt=""></a>
                                        </div>
                                        <div class="product-description">
                                            <h5 class="product-name"><a href="single-product-variable-wide.html">渐变色短袖</a></h5>
                                            <div class="price-box">
                                                <h4>$ 12.00</h4>
                                            </div>

                                        </div>
                                    </div>
                                    <!-- end of single vertical product -->
                                    <!-- single vertical product -->
                                    <div class="single-auto-vertical-product d-flex">
                                        <div class="product-image">
                                            <a href="single-product-variable-wide.html"><img src="assets/images/products/7.jpg"
                                                    class="img-fluid" alt=""></a>
                                        </div>
                                        <div class="product-description">
                                            <h5 class="product-name"><a href="single-product-variable-wide.html">渐变色短袖</a></h5>
                                            <div class="price-box">
                                                <h4>$ 12.00</h4>
                                            </div>

                                        </div>
                                    </div>
                                    <!-- end of single vertical product -->

                                </div>
                            </div>
                            </div>
                        </div>
                        <!-- end of vertical auto slider container -->

                        <!-- homepage sidebar banner -->
                        <div class="sidebar">
                            <div class="homepage-sidebar-banner-container mt-40 mb-40">
                                <a href="shop-left-sidebar.html">
                                    <img src="assets/images/banners/banner-left.jpg" class="img-fluid" alt="">
                                </a>
                            </div>
                        </div>
                        <!-- end of homepage sidebar banner -->


                    </div>
                </div>
                <div class="col-lg-9 col-md-8">
                    <div class="homepage-main-content">
                        <!-- horizontal product slider -->
                        <div class="horizontal-product-slider">
                            <div class="row">
                                <div class="col-lg-12">
                                    <!-- Block title -->
                                    <div class="block-title">
                                        <h2><a href="#">网球</a></h2>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-lg-12">
                                    <!-- horizontal product slider container -->
                                    <div class="horizontal-product-list">
                                        <!-- single product -->
                                        <div class="single-product">
                                            <div class="single-product-content">
                                                <div class="product-image">
                                                    <a href="single-product-variable-wide.html">
                                                        <img src="assets/images/products/1.jpg" class="img-fluid" alt="">
                                                        <img src="assets/images/products/2.jpg" class="img-fluid" alt="">
                                                    </a>
                                                    <div class="image-btn">
                                                        <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                class="fa fa-search"></i></a>
                                                        <a href="#"><i class="fa fa-heart-o"></i></a>
                                                    </div>
                                                </div>
                                                <h5 class="product-name"><a href="single-product-variable-wide.html">渐变色短袖</a></h5>
                                                <div class="price-box">
                                                    <h4>$ 12.00</h4>
                                                </div>

                                                <a href="#" class="add-to-cart-btn" data-toggle="modal" data-target="#add-to-cart-modal-container"><i
                                                        class="fa fa-shopping-cart"></i> 添加到购物车</a>
                                            </div>
                                        </div>
                                        <!-- end of single product -->
                                        <!-- single product -->
                                        <div class="single-product">
                                            <div class="single-product-content">
                                                <div class="product-image">
                                                    <a href="single-product-variable-wide.html">
                                                        <img src="assets/images/products/3.jpg" class="img-fluid" alt="">
                                                        <img src="assets/images/products/4.jpg" class="img-fluid" alt="">
                                                    </a>
                                                    <div class="image-btn">
                                                        <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                class="fa fa-search"></i></a>
                                                        <a href="#"><i class="fa fa-heart-o"></i></a>
                                                    </div>
                                                </div>
                                                <h5 class="product-name"><a href="single-product-variable-wide.html">印花裙</a></h5>
                                                <div class="price-box">
                                                    <h4>$ 12.00</h4>
                                                </div>

                                                <a href="#" class="add-to-cart-btn" data-toggle="modal" data-target="#add-to-cart-modal-container"><i
                                                        class="fa fa-shopping-cart"></i> 添加到购物车</a>
                                            </div>
                                        </div>
                                        <!-- end of single product -->
                                        <!-- single product -->
                                        <div class="single-product">
                                            <div class="single-product-content">
                                                <div class="product-image">
                                                    <a href="single-product-variable-wide.html">
                                                        <img src="assets/images/products/5.jpg" class="img-fluid" alt="">
                                                        <img src="assets/images/products/6.jpg" class="img-fluid" alt="">
                                                    </a>
                                                    <div class="image-btn">
                                                        <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                class="fa fa-search"></i></a>
                                                        <a href="#"><i class="fa fa-heart-o"></i></a>
                                                    </div>
                                                </div>
                                                <h5 class="product-name"><a href="single-product-variable-wide.html">印花裙</a></h5>
                                                <div class="price-box">
                                                    <h4>$ 12.00</h4>
                                                </div>

                                                <a href="#" class="add-to-cart-btn" data-toggle="modal" data-target="#add-to-cart-modal-container"><i
                                                        class="fa fa-shopping-cart"></i> 添加到购物车</a>
                                            </div>
                                        </div>
                                        <!-- end of single product -->
                                        <!-- single product -->
                                        <div class="single-product">
                                            <div class="single-product-content">
                                                <div class="product-image">
                                                    <a href="single-product-variable-wide.html">
                                                        <img src="assets/images/products/7.jpg" class="img-fluid" alt="">
                                                        <img src="assets/images/products/8.jpg" class="img-fluid" alt="">
                                                    </a>
                                                    <div class="image-btn">
                                                        <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                class="fa fa-search"></i></a>
                                                        <a href="#"><i class="fa fa-heart-o"></i></a>
                                                    </div>
                                                </div>
                                                <h5 class="product-name"><a href="single-product-variable-wide.html">渐变色短袖</a></h5>
                                                <div class="price-box">
                                                    <h4>$ 12.00</h4>
                                                </div>

                                                <a href="#" class="add-to-cart-btn" data-toggle="modal" data-target="#add-to-cart-modal-container"><i
                                                        class="fa fa-shopping-cart"></i> 添加到购物车</a>
                                            </div>
                                        </div>
                                        <!-- end of single product -->
                                        <!-- single product -->
                                        <div class="single-product">
                                            <div class="single-product-content">
                                                <div class="product-image">
                                                    <a href="single-product-variable-wide.html">
                                                        <img src="assets/images/products/9.jpg" class="img-fluid" alt="">
                                                        <img src="assets/images/products/10.jpg" class="img-fluid" alt="">
                                                    </a>
                                                    <div class="image-btn">
                                                        <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                class="fa fa-search"></i></a>
                                                        <a href="#"><i class="fa fa-heart-o"></i></a>
                                                    </div>
                                                </div>
                                                <h5 class="product-name"><a href="single-product-variable-wide.html">印花裙</a></h5>
                                                <div class="price-box">
                                                    <h4>$ 12.00</h4>
                                                </div>

                                                <a href="#" class="add-to-cart-btn" data-toggle="modal" data-target="#add-to-cart-modal-container"><i
                                                        class="fa fa-shopping-cart"></i> 添加到购物车</a>
                                            </div>
                                        </div>
                                        <!-- end of single product -->


                                    </div>
                                    <!-- end of horizontal product slider container -->
                                </div>
                            </div>
                        </div>
                        <!-- end of horizontal product slider -->

                        <!-- horizontal product slider -->
                        <div class="horizontal-product-slider">
                            <div class="row">
                                <div class="col-lg-12">
                                    <!-- Block title -->
                                    <div class="block-title">
                                        <h2><a href="#">网球</a></h2>
                                    </div>
                                </div>
                            </div>
                            <div class="row">
                                <div class="col-lg-12">
                                    <!-- horizontal product slider container -->
                                    <div class="horizontal-product-list">
                                        <!-- single product -->
                                        <div class="single-product">
                                            <div class="single-product-content">
                                                <div class="product-image">
                                                    <a href="single-product-variable-wide.html">
                                                        <img src="assets/images/products/1.jpg" class="img-fluid" alt="">
                                                        <img src="assets/images/products/2.jpg" class="img-fluid" alt="">
                                                    </a>
                                                    <div class="image-btn">
                                                        <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                class="fa fa-search"></i></a>
                                                        <a href="#"><i class="fa fa-heart-o"></i></a>
                                                    </div>
                                                </div>
                                                <h5 class="product-name"><a href="single-product-variable-wide.html">渐变色短袖</a></h5>
                                                <div class="price-box">
                                                    <h4>$ 12.00</h4>
                                                </div>

                                                <a href="#" class="add-to-cart-btn" data-toggle="modal" data-target="#add-to-cart-modal-container"><i
                                                        class="fa fa-shopping-cart"></i> 添加到购物车</a>
                                            </div>
                                        </div>
                                        <!-- end of single product -->
                                        <!-- single product -->
                                        <div class="single-product">
                                            <div class="single-product-content">
                                                <div class="product-image">
                                                    <a href="single-product-variable-wide.html">
                                                        <img src="assets/images/products/3.jpg" class="img-fluid" alt="">
                                                        <img src="assets/images/products/4.jpg" class="img-fluid" alt="">
                                                    </a>
                                                    <div class="image-btn">
                                                        <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                class="fa fa-search"></i></a>
                                                        <a href="#"><i class="fa fa-heart-o"></i></a>
                                                    </div>
                                                </div>
                                                <h5 class="product-name"><a href="single-product-variable-wide.html">印花裙</a></h5>
                                                <div class="price-box">
                                                    <h4>$ 12.00</h4>
                                                </div>

                                                <a href="#" class="add-to-cart-btn" data-toggle="modal" data-target="#add-to-cart-modal-container"><i
                                                        class="fa fa-shopping-cart"></i> 添加到购物车</a>
                                            </div>
                                        </div>
                                        <!-- end of single product -->
                                        <!-- single product -->
                                        <div class="single-product">
                                            <div class="single-product-content">
                                                <div class="product-image">
                                                    <a href="single-product-variable-wide.html">
                                                        <img src="assets/images/products/5.jpg" class="img-fluid" alt="">
                                                        <img src="assets/images/products/6.jpg" class="img-fluid" alt="">
                                                    </a>
                                                    <div class="image-btn">
                                                        <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                class="fa fa-search"></i></a>
                                                        <a href="#"><i class="fa fa-heart-o"></i></a>
                                                    </div>
                                                </div>
                                                <h5 class="product-name"><a href="single-product-variable-wide.html">印花裙</a></h5>
                                                <div class="price-box">
                                                    <h4>$ 12.00</h4>
                                                </div>

                                                <a href="#" class="add-to-cart-btn" data-toggle="modal" data-target="#add-to-cart-modal-container"><i
                                                        class="fa fa-shopping-cart"></i> 添加到购物车</a>
                                            </div>
                                        </div>
                                        <!-- end of single product -->
                                        <!-- single product -->
                                        <div class="single-product">
                                            <div class="single-product-content">
                                                <div class="product-image">
                                                    <a href="single-product-variable-wide.html">
                                                        <img src="assets/images/products/7.jpg" class="img-fluid" alt="">
                                                        <img src="assets/images/products/8.jpg" class="img-fluid" alt="">
                                                    </a>
                                                    <div class="image-btn">
                                                        <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                class="fa fa-search"></i></a>
                                                        <a href="#"><i class="fa fa-heart-o"></i></a>
                                                    </div>
                                                </div>
                                                <h5 class="product-name"><a href="single-product-variable-wide.html">渐变色短袖</a></h5>
                                                <div class="price-box">
                                                    <h4>$ 12.00</h4>
                                                </div>

                                                <a href="#" class="add-to-cart-btn" data-toggle="modal" data-target="#add-to-cart-modal-container"><i
                                                        class="fa fa-shopping-cart"></i> 添加到购物车</a>
                                            </div>
                                        </div>
                                        <!-- end of single product -->
                                        <!-- single product -->
                                        <div class="single-product">
                                            <div class="single-product-content">
                                                <div class="product-image">
                                                    <a href="single-product-variable-wide.html">
                                                        <img src="assets/images/products/9.jpg" class="img-fluid" alt="">
                                                        <img src="assets/images/products/10.jpg" class="img-fluid" alt="">
                                                    </a>
                                                    <div class="image-btn">
                                                        <a href="#" data-toggle="modal" data-target="#quick-view-modal-container"><i
                                                                class="fa fa-search"></i></a>
                                                        <a href="#"><i class="fa fa-heart-o"></i></a>
                                                    </div>
                                                </div>
                                                <h5 class="product-name"><a href="single-product-variable-wide.html">印花裙</a></h5>
                                                <div class="price-box">
                                                    <h4>$ 12.00</h4>
                                                </div>

                                                <a href="#" class="add-to-cart-btn" data-toggle="modal" data-target="#add-to-cart-modal-container"><i
                                                        class="fa fa-shopping-cart"></i> 添加到购物车</a>
                                            </div>
                                        </div>
                                        <!-- end of single product -->


                                    </div>
                                    <!-- end of horizontal product slider container -->
                                </div>
                            </div>
                        </div>
                        <!-- end of horizontal product slider -->

                        <!-- homepage double banner section -->
                        <div class="homepage-banners mb-50">
                                <div class="row">
                                    <div class="col-lg-6 col-md-12 mb-20 mb-lg-0">
                                        <!-- ======  Homepage single split banner  ======= -->

                                        <div class="single-banner-container">
                                            <a href="shop-left-sidebar.html">
                                                <img src="assets/images/banners/banner1.png" class="img-fluid" alt="">
                                            </a>
                                        </div>

                                        <!-- ====  End of Homepage single split banner  ==== -->

                                    </div>
                                    <div class="col-lg-6 col-md-12">
                                        <!-- ======  Homepage single split banner  ======= -->

                                        <div class="single-banner-container">
                                            <a href="shop-left-sidebar.html">
                                                <img src="assets/images/banners/banner2.png" class="img-fluid" alt="">
                                            </a>
                                        </div>

                                        <!-- ====  End of Homepage single split banner  ==== -->

                                    </div>

                                </div>
                            </div>
                            <!-- end of homepage double banner section -->

                    </div>
                </div>
            </div>

            <!-- latest product section -->

            <div class="latest-product-section mb-50">
                <div class="row">
                    <div class="col-lg-12">
                        <!-- Block title -->
                        <div class="block-title">
                            <h2>最新产品</h2>
                        </div>
                    </div>
                </div>
                <div class="row">
                    <div class="col-lg-2 col-md-4 col-sm-6">
                        <!-- single latest product -->
                        <div class="single-latest-product">
                            <div class="product-image">
                                <a href="single-product-variable-wide.html">
                                    <img src="assets/images/products/1.jpg" class="img-fluid" alt="">
                                    <img src="assets/images/products/2.jpg" class="img-fluid" alt="">
                                </a>
                            </div>
                            <div class="product-description">
                                <h5 class="product-name"><a href="#">渐变色短袖</a></h5>
                                <div class="price-box">
                                    <h4>$ 12.00</h4>
                                </div>
                            </div>

                            <div class="latest-product-hover-content">
                                <a href="#" data-toggle="modal" data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                    添加到购物车</a>
                                <p>
                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container">快速浏览</a> | <a href="#"> 收藏 </a>
                                </p>
                            </div>
                        </div>
                        <!-- end of single latest product -->
                    </div>
                    <div class="col-lg-2 col-md-4 col-sm-6">
                        <!-- single latest product -->
                        <div class="single-latest-product">
                            <div class="product-image">
                                <a href="single-product-variable-wide.html">
                                    <img src="assets/images/products/3.jpg" class="img-fluid" alt="">
                                    <img src="assets/images/products/4.jpg" class="img-fluid" alt="">
                                </a>
                            </div>
                            <div class="product-description">
                                <h5 class="product-name"><a href="#">渐变色短袖</a></h5>
                                <div class="price-box">
                                    <h4>$ 12.00</h4>
                                </div>
                            </div>

                            <div class="latest-product-hover-content">
                                <a href="#" data-toggle="modal" data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                    添加到购物车</a>
                                <p>
                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container">快速浏览</a> | <a href="#"> 收藏 </a>
                                </p>
                            </div>
                        </div>
                        <!-- end of single latest product -->
                    </div>
                    <div class="col-lg-2 col-md-4 col-sm-6">
                        <!-- single latest product -->
                        <div class="single-latest-product">
                            <div class="product-image">
                                <a href="single-product-variable-wide.html">
                                    <img src="assets/images/products/5.jpg" class="img-fluid" alt="">
                                    <img src="assets/images/products/6.jpg" class="img-fluid" alt="">
                                </a>
                            </div>
                            <div class="product-description">
                                <h5 class="product-name"><a href="#">渐变色短袖</a></h5>
                                <div class="price-box">
                                    <h4>$ 12.00</h4>
                                </div>
                            </div>

                            <div class="latest-product-hover-content">
                                <a href="#" data-toggle="modal" data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                    添加到购物车</a>
                                <p>
                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container">快速浏览</a> | <a href="#"> 收藏 </a>
                                </p>
                            </div>
                        </div>
                        <!-- end of single latest product -->
                    </div>
                    <div class="col-lg-2 col-md-4 col-sm-6">
                        <!-- single latest product -->
                        <div class="single-latest-product">
                            <div class="product-image">
                                <a href="single-product-variable-wide.html">
                                    <img src="assets/images/products/7.jpg" class="img-fluid" alt="">
                                    <img src="assets/images/products/8.jpg" class="img-fluid" alt="">
                                </a>
                            </div>
                            <div class="product-description">
                                <h5 class="product-name"><a href="#">渐变色短袖</a></h5>
                                <div class="price-box">
                                    <h4>$ 12.00</h4>
                                </div>
                            </div>

                            <div class="latest-product-hover-content">
                                <a href="#" data-toggle="modal" data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                    添加到购物车</a>
                                <p>
                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container">快速浏览</a> | <a href="#"> 收藏 </a>
                                </p>
                            </div>
                        </div>
                        <!-- end of single latest product -->
                    </div>
                    <div class="col-lg-2 col-md-4 col-sm-6">
                        <!-- single latest product -->
                        <div class="single-latest-product">
                            <div class="product-image">
                                <a href="single-product-variable-wide.html">
                                    <img src="assets/images/products/9.jpg" class="img-fluid" alt="">
                                    <img src="assets/images/products/10.jpg" class="img-fluid" alt="">
                                </a>
                            </div>
                            <div class="product-description">
                                <h5 class="product-name"><a href="#">渐变色短袖</a></h5>
                                <div class="price-box">
                                    <h4>$ 12.00</h4>
                                </div>
                            </div>

                            <div class="latest-product-hover-content">
                                <a href="#" data-toggle="modal" data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                    添加到购物车</a>
                                <p>
                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container">快速浏览</a> | <a href="#"> 收藏 </a>
                                </p>
                            </div>
                        </div>
                        <!-- end of single latest product -->
                    </div>
                    <div class="col-lg-2 col-md-4 col-sm-6">
                        <!-- single latest product -->
                        <div class="single-latest-product">
                            <div class="product-image">
                                <a href="single-product-variable-wide.html">
                                    <img src="assets/images/products/1.jpg" class="img-fluid" alt="">
                                    <img src="assets/images/products/2.jpg" class="img-fluid" alt="">
                                </a>
                            </div>
                            <div class="product-description">
                                <h5 class="product-name"><a href="#">渐变色短袖</a></h5>
                                <div class="price-box">
                                    <h4>$ 12.00</h4>
                                </div>
                            </div>

                            <div class="latest-product-hover-content">
                                <a href="#" data-toggle="modal" data-target="#add-to-cart-modal-container"><i class="fa fa-shopping-cart"></i>
                                    添加到购物车</a>
                                <p>
                                    <a href="#" data-toggle="modal" data-target="#quick-view-modal-container">快速浏览</a> | <a href="#"> 收藏 </a>
                                </p>
                            </div>
                        </div>
                        <!-- end of single latest product -->
                    </div>
                </div>
            </div>

            <!-- end of latest product section -->
        </div>
    </div>

    <!--====  End of homepage content section  ====-->


    <!--=======================================
	=            brand logo slider            =
	========================================-->

    <div class="brand-logo-slider mb-50">
        <div class="container">
            <div class="row">
                <div class="col-lg-12 col-sm-12">
                    <div class="brand-logo-list">
                        <!-- ======  single brand logo block  ====== -->

                        <div class="single-brand-logo">
                            <a href="#">
                                <img src="assets/images/brand-logos/1.jpg" alt="">
                            </a>
                        </div>

                        <!-- ====  End of single brand logo block  ==== -->
                        <!-- ======  single brand logo block  ====== -->

                        <div class="single-brand-logo">
                            <a href="#">
                                <img src="assets/images/brand-logos/2.jpg" alt="">
                            </a>
                        </div>

                        <!-- ====  End of single brand logo block  ==== -->
                        <!-- ======  single brand logo block  ====== -->

                        <div class="single-brand-logo">
                            <a href="#">
                                <img src="assets/images/brand-logos/3.jpg" alt="">
                            </a>
                        </div>

                        <!-- ====  End of single brand logo block  ==== -->
                        <!-- ======  single brand logo block  ====== -->

                        <div class="single-brand-logo">
                            <a href="#">
                                <img src="assets/images/brand-logos/4.jpg" alt="">
                            </a>
                        </div>

                        <!-- ====  End of single brand logo block  ==== -->
                        <!-- ======  single brand logo block  ====== -->

                        <div class="single-brand-logo">
                            <a href="#">
                                <img src="assets/images/brand-logos/5.jpg" alt="">
                            </a>
                        </div>

                        <!-- ====  End of single brand logo block  ==== -->
                        <!-- ======  single brand logo block  ====== -->

                        <div class="single-brand-logo">
                            <a href="#">
                                <img src="assets/images/brand-logos/6.jpg" alt="">
                            </a>
                        </div>

                        <!-- ====  End of single brand logo block  ==== -->
                        <!-- ======  single brand logo block  ====== -->

                        <div class="single-brand-logo">
                            <a href="#">
                                <img src="assets/images/brand-logos/7.jpg" alt="">
                            </a>
                        </div>

                        <!-- ====  End of single brand logo block  ==== -->

                    </div>
                </div>
            </div>
        </div>
    </div>

    <!--====  End of brand logo slider  ====-->



    <!--========================================
	=            newsletter section            =
	=========================================-->

    <section class="newsletter-section">
        <div class="container">
            <div class="newsletter-container dark-bg">
                <div class="container">
                    <div class="row">
                        <div class="col-lg-8 col-md-12 col-sm-12">

                            <!-- ======  Newsletter input box  ======= -->

                            <div class="newsletter-wrapper d-md-flex">
                                <!-- newsletter text -->
                                <div class="newsletter-text">
                                    <h2>通讯 <span>注册我们的通讯</span></h2>
                                </div>
                                <!-- end of newsletter text -->

                                <!-- newsletter input -->
                                <div class="newsletter-input">
                                    <div class="input-group">
                                        <div class="input-group-append">
                                            <form id="mc-form" class="mc-form subscribe-form">
                                                <input type="email" id="mc-email" type="email" autocomplete="off"
                                                    placeholder="请输入你的邮箱" required>
                                                <button id="mc-submit" type="submit"> 订阅 </button>
                                            </form>

                                        </div>
                                    </div>
                                    <!-- mailchimp-alerts Start -->
                                    <div class="mailchimp-alerts">
                                        <div class="mailchimp-submitting"></div><!-- mailchimp-submitting end -->
                                        <div class="mailchimp-success"></div><!-- mailchimp-success end -->
                                        <div class="mailchimp-error"></div><!-- mailchimp-error end -->
                                    </div><!-- mailchimp-alerts end -->
                                </div>
                                <!-- end of newsletter input -->
                            </div>

                            <!-- ====  End of Newsletter input box  ==== -->

                        </div>
                        <div class="col-lg-4 col-md-12 col-sm-12">
                            <!-- ======  Social icon list  ======= -->

                            <div class="social-icons text-right mt-5">
                                <ul>
                                    <li><a class="facebook-link" href="//www.facebook.com"><i class="fa fa-facebook"></i></a>
                                        <span class="popup">facebook</span>
                                    </li>
                                    <li><a class="rss-link" href="//rss.com"><i class="fa fa-rss"></i></a>
                                        <span class="popup">rss</span>
                                    </li>
                                    <li><a class="twitter-link" href="//www.twitter.com"><i class="fa fa-twitter"></i></a>
                                        <span class="popup">twitter</span>
                                    </li>
                                    <li><a class="skype-link" href="//www.skype.com"><i class="fa fa-skype"></i></a>
                                        <span class="popup">Skype</span>
                                    </li>
                                    <li><a class="dribbble-link" href="//www.dribbble.com"><i class="fa fa-dribbble"></i></a>
                                        <span class="popup">Dribbble</span>
                                    </li>
                                </ul>
                            </div>

                            <!-- ====  End of Social icon list  ==== -->

                        </div>
                    </div>
                </div>
            </div>
        </div>
    </section>

    <!--====  End of newsletter section  ====-->

    <!--============================
	=            footer            =
	=============================-->

    <footer>
        <div class="container">
            <!-- footer navigation -->
            <div class="footer-navigation section-padding">
                <div class="row">
                    <div class="col-lg-4 col-md-4">
                        <!-- footer description -->
                        <div class="footer-description">
                            <div class="footer-logo">
                                <img src="assets/images/logo.png" alt="">
                            </div>
                            <p>这是一串随机生成的文字，没有实际意义。请不要将重要信息填入，以防泄漏。如有雷同，纯属巧合。。。</p>
                        </div>
                        <!-- end of footer description -->
                    </div>
                    <div class="col-lg-8 col-md-8">
                        <!-- footer nav links -->
                        <div class="row">
                            <div class="col-lg-3 col-md-6">
                                <!-- single footer nav block -->
                                <div class="single-footer-nav-block">
                                    <h2 class="block-title">信息</h2>
                                    <ul class="footer-nav-links">
                                        <li><a href="shop-left-sidebar.html">特价</a></li>
														<li><a href="shop-left-sidebar.html">新产品</a></li>
														<li><a href="shop-left-sidebar.html">最畅销</a></li>
														<li><a href="contact.html">联系我们</a></li>
														<li><a href="about.html">关于我们</a></li>
                                    </ul>
                                </div>
                                <!-- end of single footer nav block -->
                            </div>
                            <div class="col-lg-3 col-md-6">
                                <!-- single footer nav block -->
                                <div class="single-footer-nav-block">
                                    <h2 class="block-title"><a href="my-account.html">我的帐户</a></h2>
													<ul class="footer-nav-links">
														<li><a href="#">我的订单</a></li>
														<li><a href="#">我的信用单</a></li>
														<li><a href="my-account.html">我的地址</a></li>
														<li><a href="my-account.html">个人信息</a></li>
													</ul>
                                </div>
                                <!-- end of single footer nav block -->
                            </div>
                            <div class="col-lg-3 col-md-6">
                                <!-- single footer nav block -->
                                <div class="single-footer-nav-block">
                                    <h2 class="block-title">类别</h2>
													<ul class="footer-nav-links">
														<li><a href="shop-left-sidebar.html">足球</a></li>
														<li><a href="shop-left-sidebar.html">网球</a></li>
														<li><a href="shop-left-sidebar.html">婴儿食品</a></li>
														<li><a href="shop-left-sidebar.html">板球</a></li>
														<li><a href="shop-left-sidebar.html">棒球</a></li>
													</ul>
                                </div>
                                <!-- end of single footer nav block -->
                            </div>
                            <div class="col-lg-3 col-md-6">
                                <!-- single footer nav block -->
                                <div class="single-footer-nav-block">
                                    <h2 class="block-title">我们的服务</h2>
													<ul class="footer-nav-links">
														<li><a href="store.html">我们的店</a></li>
														<li><a href="about.html">信息</a></li>
														<li><a href="#">隐私政策</a></li>
														<li><a href="#">条款 & 条件</a></li>
													</ul>
                                </div>
                                <!-- end of single footer nav block -->
                            </div>
                        </div>
                        <!-- end of footer nav links -->

                    </div>
                </div>
            </div>
            <!-- end of footer navigation -->

            <!-- copyright section -->
            <div class="copyright-section">
                <div class="copyright-container">
                    <div class="row">
                        <div class="col-lg-6 col-md-6 col-sm-12">
                            <p class="copyright-text text-center text-md-left">Copyright © 2018 <a href="#">Rossi</a>. All Rights
                                Reserved</p>
                        </div>
                        <div class="col-lg-6 col-md-6 col-sm-12">
                            <div class="payment-logos text-md-right text-center">
                                <img src="assets/images/payment.png" alt="payment logo">
                            </div>
                        </div>
                    </div>
                </div>
                <!-- end of copyright section -->
            </div>
        </div>
    </footer>

    <!--====  End of footer  ====-->


    <!-- quick view modal -->
    <div class="modal fade quick-view-modal-container" id="quick-view-modal-container" tabindex="-1" role="dialog"
        aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header">

                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-lg-5 col-md-7">
                            <!-- product quickview image gallery -->
                            <!--Modal Tab Content Start-->
                            <div class="tab-content product-details-large" id="myTabContent">
                                <div class="tab-pane fade show active" id="single-slide1" role="tabpanel"
                                    aria-labelledby="single-slide-tab-1">
                                    <!--Single Product Image Start-->
                                    <div class="single-product-img img-full">
                                        <img src="assets/images/product-slider-images/image1.jpg" class="img-fluid" alt="">
                                    </div>
                                    <!--Single Product Image End-->
                                </div>
                                <div class="tab-pane fade" id="single-slide2" role="tabpanel" aria-labelledby="single-slide-tab-2">
                                    <!--Single Product Image Start-->
                                    <div class="single-product-img img-full">
                                        <img src="assets/images/product-slider-images/image2.jpg" class="img-fluid" alt="">
                                    </div>
                                    <!--Single Product Image End-->
                                </div>
                                <div class="tab-pane fade" id="single-slide3" role="tabpanel" aria-labelledby="single-slide-tab-3">
                                    <!--Single Product Image Start-->
                                    <div class="single-product-img img-full">
                                        <img src="assets/images/product-slider-images/image3.jpg" class="img-fluid" alt="">
                                    </div>
                                    <!--Single Product Image End-->
                                </div>
                                <div class="tab-pane fade" id="single-slide4" role="tabpanel" aria-labelledby="single-slide-tab-4">
                                    <!--Single Product Image Start-->
                                    <div class="single-product-img img-full">
                                        <img src="assets/images/product-slider-images/image4.jpg" class="img-fluid" alt="">
                                    </div>
                                    <!--Single Product Image End-->
                                </div>
                            </div>
                            <!--Modal Content End-->
                            <!--Modal Tab Menu Start-->
                            <div class="single-product-menu">
                                <div class="nav single-slide-menu" role="tablist">
                                    <div class="single-tab-menu img-full">
                                        <a data-toggle="tab" id="single-slide-tab-1" href="#single-slide1"><img src="assets/images/product-slider-images/image1.jpg"
                                                class="img-fluid" alt=""></a>
                                    </div>
                                    <div class="single-tab-menu img-full">
                                        <a data-toggle="tab" id="single-slide-tab-2" href="#single-slide2"><img src="assets/images/product-slider-images/image2.jpg"
                                                class="img-fluid" alt=""></a>
                                    </div>
                                    <div class="single-tab-menu img-full">
                                        <a data-toggle="tab" id="single-slide-tab-3" href="#single-slide3"><img src="assets/images/product-slider-images/image3.jpg"
                                                class="img-fluid" alt=""></a>
                                    </div>
                                    <div class="single-tab-menu img-full">
                                        <a data-toggle="tab" id="single-slide-tab-4" href="#single-slide4"><img src="assets/images/product-slider-images/image4.jpg"
                                                alt=""></a>
                                    </div>
                                </div>
                            </div>
                            <!--Modal Tab Menu End-->
                            <!-- end of product quickview image gallery -->
                        </div>
                        <div class="col-lg-7 col-md-5">
                            <!-- product quick view description -->
                            <div class="product-options">
                                <h2 class="product-title">渐变色短袖</h2>
                                <p class="condition"><span>状况:</span> 新</p>
                                <h2 class="product-price">$12.90</h2>
                                <p class="product-description">渐变色短袖高领t恤。柔软有弹性的材料
									舒适健康。戴上草帽，你就为夏天做好了准备!</p>
                                <div class="social-share-buttons">
                                    <ul>
                                        <li><a class="twitter" href="#"><i class="fa fa-twitter"></i> Tweet</a></li>
                                        <li><a class="facebook" href="#"><i class="fa fa-facebook"></i> Share</a></li>
                                        <li><a class="google-plus" href="#"><i class="fa fa-google-plus"></i> Google+</a></li>
                                        <li><a class="pinterest" href="#"><i class="fa fa-pinterest"></i> Pinterest</a></li>
                                    </ul>
                                </div>
                                <p class="stock-details">288 件 <span class="stock-status in-stock">有现货</span></p>
                                <p class="quantity">数量:
                                    <span class="pro-qty counter"><input type="text" value="1" class="mr-5"></span>

                                </p>
                                <p class="size">
									尺码: <br>
                                    <select name="chooseSize" id="chooseSize">
                                        <option value="0">XXL</option>
                                        <option value="0">L</option>
                                        <option value="0">M</option>
                                        <option value="0">S</option>
                                    </select>
                                </p>
                                <p class="color">
									颜色: <br>
                                    <a href="#"><span class="color-block color-choice-1"></span></a>
                                    <a href="#"><span class="color-block color-choice-2"></span></a>
                                    <a href="#"><span class="color-block color-choice-3 active"></span></a>
                                </p>

                                <a href="#" class="add-to-cart-btn" data-toggle="modal" data-target="#add-to-cart-modal-container"><i
                                        class="fa fa-shopping-cart"></i>
                                    添加到购物车</a>
                            </div>
                            <!-- end of product quick view description -->
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>
    <!-- end of quick view modal -->


    <!-- add to cart modal -->
    <div class="modal fade add-to-cart-modal-container" id="add-to-cart-modal-container" tabindex="-1" role="dialog"
        aria-hidden="true">
        <div class="modal-dialog modal-dialog-centered" role="document">
            <div class="modal-content">
                <div class="modal-header">

                    <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                        <span aria-hidden="true">&times;</span>
                    </button>
                </div>
                <div class="modal-body">
                    <div class="row">
                        <div class="col-lg-6 col-md-6">
                            <!-- cart product short details -->

                            <div class="cart-product-short-desc">
                                <h2 class="cart-success-message"> 产品成功添加到您的购物车</h2>
                                <div class="cart-product-short-desc-content d-flex">
                                    <div class="product-image">
                                        <img src="assets/images/products/faded-short-sleeve-tshirts.jpg" class="img-fluid"
                                            alt="">
                                    </div>
                                    <div class="product-desc">
                                        <h4 class="product-title">印花裙</h4>
										<p class="color-size">黄色, S</p>
										<p class="quantity"><span>数量</span> 1</p>
										<p class="total-amount"><span>共计:</span> $20.40</p>
                                    </div>
                                </div>
                            </div>
                            <!-- end of cart product short details -->
                        </div>
                        <div class="col-lg-6 col-md-6">
                            <!-- cart product calculation -->
                            <div class="cart-product-calculation">
                                <h2 class="cart-info-message">您的购物车中有1件商品.</h2>
								<div class="product-calculations">
									<p><span>总产品</span> $20.50</p>
									<p><span>总运费</span> $2</p>
									<p><span>共计</span> $22.50</p>
								</div>
                            </div>
                            <!-- end of cart product calculation -->

                            <!-- cart modal buttons -->
                            <div class="cart-modal-buttons">
								<a class="continue-shopping-btn" href="shop-left-sidebar.html"><i class="fa fa-chevron-left"></i> 继续购物 </a>
								<a class="proceed-checkout-btn" href="checkout.html">进行结算 <i class="fa fa-chevron-right"></i>
								</a>
							</div>
                            <!-- end of cart modal buttons -->

                        </div>
                    </div>
                </div>

            </div>
        </div>
    </div>
    <!-- end of add to cart modal -->




    <!-- scroll to top  -->
    <a href="#" class="scroll-top"></a>
    <!-- end of scroll to top -->



    <!-- ************************* JS ************************* -->
    <!-- jQuery JS -->
    <script src="assets/js/vendor/jquery.min.js"></script>

    <!-- Popper JS -->
    <script src="assets/js/popper.min.js"></script>

    <!-- Bootstrap JS -->
    <script src="assets/js/bootstrap.min.js"></script>

    <!-- Plugins JS -->
    <script src="assets/js/plugins.js"></script>

    <!-- Main JS -->
    <script src="assets/js/main.js"></script>

</body>

</html>